.listyle() {
    .sports-content {
        padding: 5px;

        ul {
            display: flex;
            flex-wrap: wrap;

            li {
                width: calc(~"50% - 10px");
                text-align: center;
                box-shadow: 0px 0px 2px 2px #ccc;
                padding: 6px;
                margin: 10px 5px;

                .pro-pri {
                    margin-bottom: 6px;

                    span {
                        &:first-of-type {
                            color: #f00;
                        }

                        &:nth-of-type(2) {
                            color: #ddd;
                            text-decoration: line-through;
                        }
                    }
                }
            }
        }
    }
}

nav {
    padding: 5px;

    ul {
        display: flex;
        flex-wrap: wrap;

        li {
            width: calc(~"100%/3");
        }
    }
}

.brand {
    padding: 5px;

    .brand-content {
        ul {
            display: flex;
            flex-wrap: wrap;

            li {
                width: calc(~"100%/4");
            }
        }
    }
}

.sports {
    padding: 5px;

    .listyle()
}

.male {
    padding: 5px;
    .listyle()
}

.female {
    padding: 5px;
    .listyle()
}